<template>
    <div>
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item>
                    <i class="el-icon-lx-calendar"></i> 表单
                </el-breadcrumb-item>
                <el-breadcrumb-item>插入表单</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <div class="form-box">
                <el-form   ref="form" :model="form" label-width="80px">
                    <el-form-item label="编号（*）">
                        <el-input v-model="form.num"></el-input>
                    </el-form-item>
                    <el-form-item label="姓名(*)">
                        <el-input v-model="form.name" ></el-input>
                    </el-form-item>
                    <el-form-item label="部门">
                        <el-select v-model="form.region" placeholder="请选择">
                            <el-option key="section1" label="研发" value="yf"></el-option>
                            <el-option key="section2" label="销售" value="xs"></el-option>
                            <el-option key="section3" label="生产" value="sc"></el-option>
                            <el-option key="section4" label="仓库" value="ck"></el-option>
                            <el-option key="section5" label="采购" value="cg"></el-option>
                            <el-option key="section6" label="品控" value="pk"></el-option>

                        </el-select>
                    </el-form-item>
                    <el-form-item label="入职时间" >
                        <el-col :span="11">
                            <el-date-picker
                                type="date"
                                placeholder="选择日期"
                                v-model="form.date1"
                                style="width: 100%;"
                            ></el-date-picker>
                        </el-col>
<!--                        <el-col class="line" :span="2">-</el-col>-->
<!--                        <el-col :span="11">-->
<!--                            <el-time-picker-->
<!--                                placeholder="选择时间"-->
<!--                                v-model="form.date2"-->
<!--                                style="width: 100%;"-->
<!--                            ></el-time-picker>-->
<!--                        </el-col>-->
                    </el-form-item>
                    <el-form-item label="出生日期">
                      <el-col :span="11">
                        <el-date-picker
                            type="date"
                            placeholder="选择日期"
                            v-model="form.birth"
                            style="width: 100%;"
                        ></el-date-picker>
                      </el-col>
                    </el-form-item>
                    <el-form-item label="籍贯">
                        <el-cascader :options="options" v-model="form.options"></el-cascader>
                    </el-form-item>
                  <el-form-item label="人员类别">
                    <el-select v-model="form.eclass" placeholder="请选择">
                      <el-option key="eclass1" label="实习生" value="sxs"></el-option>
                      <el-option key="eclass2" label="职员" value="zy"></el-option>
                      <el-option key="eclass3" label="总经理" value="zjl"></el-option>
                      <el-option key="eclass4" label="副经理" value="fjl"></el-option>
                      <el-option key="eclass5" label="主任" value="zr"></el-option>
                      <el-option key="eclass6" label="副主任" value="fzr"></el-option>

                    </el-select>
                  </el-form-item>
                  <el-form-item label="技术类别">
                    <el-select v-model="form.tclass" placeholder="请选择">
                      <el-option key="tclass1" label="机械加工" value="jxjg"></el-option>
                      <el-option key="tclass2" label="电器电子" value="dqdz"></el-option>
                      <el-option key="tclass3" label="化学化工" value="hxhg"></el-option>
                      <el-option key="tclass4" label="生物医药" value="swyy"></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="技术职称">
                    <el-select v-model="form.chizheng" placeholder="请选择">
                      <el-option key="chizheng1" label="助理工程师" value="zlgcs"></el-option>
                      <el-option key="chizheng2" label="工程师" value="gcs"></el-option>
                      <el-option key="chizheng3" label="高级工程师" value="gjgcs"></el-option>

                    </el-select>
                  </el-form-item>
                  <el-form-item label="文化程度">
                    <el-select v-model="form.wenhua" placeholder="请选择">
                      <el-option key="wenhua1" label="初中" value="cz"></el-option>
                      <el-option key="wenhua2" label="高中" value="gz"></el-option>
                      <el-option key="wenhua3" label="本科/大专" value="bk"></el-option>
                      <el-option key="wenhua4" label="硕士" value="ss"></el-option>
                      <el-option key="wenhua5" label="博士" value="bs"></el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="民族(*)">
                    <el-input v-model="form.minzu" ></el-input>
                  </el-form-item>
                  <el-form-item label="现住址">
                    <el-cascader :options="options" v-model="form.xianzhuzhi"></el-cascader>
                  </el-form-item>
                    <el-form-item label="单选框">
                        <el-radio-group v-model="form.resource">
                            <el-radio label="男"></el-radio>
                            <el-radio label="女"></el-radio>
                        </el-radio-group>
                    </el-form-item>
<!--                    <el-form-item label="备注">-->
<!--                        <el-input type="textarea" rows="5" v-model="form.desc"></el-input>-->
<!--                    </el-form-item>-->
                    <el-form-item>
                        <el-button type="primary" @click="onSubmit">提交数据</el-button>
                        <el-button>取消</el-button>
                    </el-form-item>
                </el-form>
            </div>
        </div>
    </div>
</template>

<script>
import { fetchData_employees} from "../api";

export default {
    name: 'baseform',
    data() {
        return {
            options: [
                {
                    value: 'liaoning',
                    label: '辽宁',
                    children: [
                        {
                            value: 'shenyang',
                            label: '沈阳',


                        },
                        {
                            value: 'dalian',
                            label: '大连',

                        },
                      {
                        value: 'anshan',
                        label: '鞍山',

                      },
                      {
                        value: 'fushun',
                        label: '抚顺',

                      },
                      {
                        value: 'benxi',
                        label: '本溪',

                      },
                      {
                        value: 'dandong',
                        label: '丹东',

                      },
                      {
                        value: 'jinzhou',
                        label: '锦州',

                      },
                      {
                        value: 'yingkou',
                        label: '营口',

                      },
                      {
                        value: 'fuxin',
                        label: '阜新',

                      },
                      {
                        value: 'liaoyang',
                        label: '辽阳',

                      },
                      {
                        value: 'panjin',
                        label: '盘锦',

                      },
                      {
                        value: 'tieling',
                        label: '铁岭',

                      },
                      {
                        value: 'chaoyang',
                        label: '朝阳市',

                      },
                      {
                        value: 'huludao',
                        label: '葫芦岛',

                      },

                    ],

                },

            ],
            form: {
                num :'', //编号
                name: '',  //姓名
                birth:'', //出生日期
                eclass:'', //人员类别
                region: '', //职位
                date1: '',// 入职日期
                tclass: '', //技术类别
                chizheng:'',//技术职称
                wenhua:'',//文化程度
                minzu:'',//民族
                xianzhuzhi:[],//现住址
                delivery: true,
                type: ['步步高'],
                resource: '小天才', //性别
                desc: '',
                options: []

            }
        };
    },
    methods: {

        onSubmit() {
          fetchData_employees(this.form).then(res =>{
            console.info("this.form");
            // console.log(this.form);

            this.tableDatas[0] = res.data


            // this.name = res.data
          })
            // this.$message.success('提交成功！');
        }
    }
};
</script>
